import { setToken, getToken, removeToken } from '@/utils/auth'
import { getUserInfoAPI, loginAPI } from '@/api/user'

// 存储状态的节点
const state = {
  token: getToken(), // 用户token，加上小括号才是方法调用
  userInfo: {}
}
// 同步操作节点：储存状态的中介
const mutations = {
  /**
   * 存储用户token
   * @param {*} state 当前模块的状态对象
   * @param {*} newToken 要存储的token
   */
  setUserToken(state, newToken) {
    // Vuex临时存储
    state.token = newToken
    // Cookies本地持久化存储
    setToken(newToken)
  },
  /**
   * 存储用户基本信息的mutation
   * @param {object} userInfo 用户基本信息
   */
  setUserInfo(state, userInfo) {
    state.userInfo = userInfo
  },
  /**
   * 清理Vuex中的token + 清理本地缓存的token
   */
  removeUserToken(state) {
    // 清理Vuex中的token
    state.token = null
    // 清理本地缓存的token
    removeToken()
  }
}
// 异步操作节点
const actions = {
  /**
   * 处理401异常的action，就是退出登录操作
   */
  logout(context) {
    // 清理Vuex中的token + 清理本地缓存的token
    context.commit('removeUserToken')
    // 清理Vuex中的userInfo
    context.commit('setUserInfo', {})
  },

  /**
   * 获取登录用户基本信息的action
   */
  async getUserInfo(context) {
    // 调用获取登录用户基本信息接口
    const userInfo = await getUserInfoAPI()
    // 提交mutations存储userInfo
    context.commit('setUserInfo', userInfo)
  },

  /**
   * 登录action：发送登录请求获取token
   * @param {*} context 上下文，调用commit提交mutations
   * @param {*} loginForm 登录表单的数据对象 {mobile, password}
   */
  async login(context, loginForm) {
    // 调用登录接口方法，获取token
    const token = await loginAPI(loginForm)
    // 调用commit提交mutations，传递token
    context.commit('setUserToken', token)
  }
}

export default {
  // 命名空间：必不可少
  namespaced: true,
  // 存储状态的节点
  state,
  // 同步操作节点
  mutations,
  // 异步操作节点
  actions
}
